<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <base href="<%=basePath %>"/>
    <title>Title</title>
    <%--引入easyUI的资源--%>
    <link rel="stylesheet" type="text/css" href="static/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="static/themes/icon.css">
    <script type="text/javascript" src="static/jquery.min.js"></script>
    <script type="text/javascript" src="static/jquery.easyui.min.js"></script>
    <%--声明css样式--%>
    <style type="text/css">
        /*声明菜单栏效果*/
        ul{position: relative;bottom: 40px;left: 150px;}
        ul li{float: left;list-style: none;margin-right: 40px;font-size: 20px;line-height: 36px; color: #fff;text-align: center;padding: 0 20px;
            height: 36px;    margin: 0 20px;    width: 140px ;   box-sizing: border-box;    border-radius: 10px;
        }
        .active{
            border-radius: 10px;
            color: #fff;
            border: 2px solid #fff;
            line-height: 31px;}
        ul li a{text-decoration: none;cursor: pointer;color: #fff;}
    </style>
    <script type="text/javascript">
        $(function () {
            $("#doLogin").click(function () {
                $('#loginDialog').dialog("open");
            })
            $("#userLogin").click(function () {
                $('#loginForm').form('submit',{
                    success:function (data) {
                        if (data!=null){
                            $.messager.alert("提示","登录成功","info")
                            $('#loginDialog').dialog("close");
                            location.reload();
                        }else {
                            $.messager.alert("提示","登录失败","info")
                        }
                    }
                })
            })
        })

    </script>
</head>
<body class="easyui-layout" id="layout">

<div id="loginDialog" class="easyui-dialog" title="登录" style="width:650px;height:550px;"
     data-options="iconCls:'icon-save',resizable:true,modal:true,closed:true,left:200,top:50">
    <%--创建增加主持人表单--%>
    <form id="loginForm" action="marriedPerson/login" method="post" style="margin: auto;text-align: left">
        <%--创建表格--%>
        <table cellpadding="10px" style="margin: auto">
            <tr>
                <td>用户名：</td>
                <td><input class="easyui-textbox"  name="pphone" prompt="请输入手机号" iconWidth="28" style="width:100%;height:34px;padding:10px;"></td>
            </tr>
            <tr>
                <td>密码：</td>
                <td><input class="easyui-textbox"  name="ppwd" prompt="请输入密码" iconWidth="28" style="width:100%;height:34px;padding:10px;"></td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <a  href="javascrip:void(0)" id="userLogin" class="easyui-linkbutton c3" style="width: 120px">登录</a>
                </td>
            </tr>
        </table>
    </form>
</div>

<div data-options="region:'north',split:false" style="height:150px;background-image: url('static/images/top_bg.png')">
    <%--创建头部工具栏--%>
    <div style="width: 1008px;height: 120px;margin: auto;">
        <%--设置网站欢迎语--%>
        <p style="color: #666666;float: left;line-height: 44px;position: relative;bottom: 10px;font-size: 14px;">
            Ting域主持人欢迎您！ 客服：13601371065（卓越老师）
        </p>
        <span style="float: right;position: relative;top:10px;">
                        <span><a href="javascript:void(0)" id="doLogin" style="color: #666666;text-decoration: none;">登录</a></span> |
                        <span><a href="reg.jsp" style="color: #666666;text-decoration: none;">注册</a></span>

                        <span>欢迎：${sessionScope.marriedPerson.pname}</span> |
                        <span><a href="reg.jsp" style="color: #666666;text-decoration: none;">退出</a></span>
                </span>
        <br>
        <%--声明网站logo--%>
        <a href="" style="cursor: pointer;">
            <img src="static/images/protal_logo.png" alt="Ting域" style="height: 80px;position: relative;right: 370px;top:20px;">
        </a>
        <%--声明网站横向菜单栏--%>
        <ul>
            <li class="active"><a href="index.jsp">首页</a></li>
            <li class="active"><a href="">主持人</a></li>
            <li class="active"><a href="">加入我们</a></li>
            <li class="active"> <a href="">关于我们</a></li>
        </ul>
    </div>
</div>
<div data-options="region:'center'" style="padding:5px;background:#eee;">
    <%--声明网站图片--%>
    <div>
        <img src="static/images/tingyu-1.jpg" width="100%" alt="">
    </div>
    <%--声明网站图片--%>
    <div>
        <img src="static/images/ting_2.png" width="100%" alt="">
    </div>
</div>

</body>
</html>
